import { memo } from "react";
import Header from "../../baseUI/header";
import TabSelect from "../../components/tabSelect";
import HomeStyle from "./styled";
import ProductList from "../../components/productList";
import { FillinOutline } from "antd-mobile-icons";
import { useNavigate } from "react-router-dom";
import { routeItmeType } from "../../router";

const Home = memo(() => {
  const nav = useNavigate();
  return (
    <>
      <Header
        title={"精品课程"}
        showReturnBtn={false}
        size="big"
        showSearch={true}
        slot_right={
          <FillinOutline
            color="var(--themeColor2)"
            onClick={() => {
              nav(`/${routeItmeType.RESERVE}`);
            }}
          />
        }
      />
      <HomeStyle>
        <TabSelect />
        <ProductList />
      </HomeStyle>
    </>
  );
});

export default Home;
